@extends("layouts.header")
@section("content")
    <article class="page-container">
        <form class="form form-horizontal" id="form" autocomplete="off">
            {{ csrf_form_field() }}
            <div class="row cl">
                <label class="form-label col-sm-3">样品类型：</label>
                <label class="form-label col-sm-9" style="text-align: left;"> {{ $data_tool->name }}</label>

            </div>
            <div class="row cl">
                <label class="form-label col-sm-3">检验标准：</label>
                <div class="formControls col-sm-9">
                    <span class="select-box" style="width:200px;">
                        <select class="select" name="std_id" size="1">
                            <option value="">--请选择--</option>
                            @foreach($data_std as $val)
                                <option value="{{$val -> id}}">{{$val -> num}}</option>
                            @endforeach
                        </select>
                    </span>
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-sm-3">检验周期：</label>
                <div class="formControls col-sm-9">
                    <input type="text" class="input-text" value="" placeholder="" name="cycle" style="width:200px;"> 年
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-sm-3">备注：</label>
                <div class="formControls col-sm-9">
                    <input type="text" class="input-text" value="" placeholder="" name="remark">
                </div>
            </div>

            @csrf

            <div class="row cl">
                <div class="col-sm-9 col-sm-offset-3">
                    <input class="btn btn-primary radius" type="submit" value="&nbsp;&nbsp;提交&nbsp;&nbsp;">
                </div>
            </div>
        </form>

        <div class="mt-15">
            <a id="sub_table" class="btn btn-primary radius r mb-10">保存表格</a>
            <table class="table table-border table-bordered table-hover table-bg table-responsive table-condensed">
                <thead>
                <tr class="text-c">
                    <th>ID</th>
                    <th>标准代号</th>
                    <th>检验周期(年)</th>
                    <th>排序</th>
                    <th width="20%">备注</th>
                    {{-- <th>添加时间</th> --}}
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>
                @foreach ($data_rel as $val)
                    <tr class="text-c">
                        <td>{{ $val->id }}</td>
                        <td>{{ $val->num }}</td>
                        <td>{{ $val->cycle }}</td>
                        <td><input onchange="chageSort({{$val->id}},{{$val->sort}},this)" type="text" class="input-text text-c" size="1" name="sort[{{$val->id}}]" value="{{ $val->sort }}"></td>
                        <td class="text-l">{{ $val->remark }}</td>
                        {{-- <td>{{ $val->ctime }}</td> --}}
                        <td>
                            <a class="ml-5 btn btn-primary-outline radius size-MINI @if(config('constant.app_name') == 'HuLuDao') hidden @endif" href="javascript:;" onclick="rel_xxx('关联位置','/{{config('constant.name_admin')}}/excelPos/excelPos', {{ $val->id }} ,'','')">报告模板</a>
                            <a class="ml-5 btn btn-primary-outline radius size-MINI" href="javascript:;" onclick="rel_xxx('关联参数','/{{config('constant.name_admin')}}/tool/relParam', {{ $val->id }} ,'','')">关联参数</a>
                            <a href="javascript:;" onclick="edit({{ $val->id }})" class="ml-5 btn btn-success-outline radius size-MINI">修改</a>
                            <a href="javascript:;" onclick="del(this,{{ $val->id }})" class="ml-5 btn btn-danger-outline radius size-MINI">删除</a>
                        </td>
                    </tr>
                @endforeach

                </tbody>
            </table>
        </div>
    </article>
    <script type="text/javascript">
        var tableData = {
            sort: {}
        }; //初始化表格数据
        $(function () {
            var index2;
            $("#form").validate({
                rules: {
                    std_id: {
                        required: true,
                    },
                    cycle: {
                        required: true,
                        isFloat: true,
                        isFloatGtZero: true,
                    },
                },
                // onkeyup:false,
                // focusCleanup:false,
                success: "valid",
                submitHandler: function (form) {
                    $(form).ajaxSubmit({
                        type: 'post',
                        url: "relStd?id="+{{request('id')}},//自己提交给自己可以不写url
                        beforeSend: function () {
                            //0.4透明度 白色遮罩
                            index2 = layer.load(2, {shade: [0.3, '#fff']});
                        },
                        complete: function () {
                            layer.close(index2);
                        },
                        success: function (data) {
                            //判断添加结果
                            if (data === '1') {
                                window.location.reload();//刷新
                                parent.layer.msg('添加成功!', {icon: 1, time: 2000});
                            } else if (data === '2') {
                                layer.msg('已存在相同的记录!', {icon: 2, time: 5000});
                            } else {
                                layer.msg('操作失败!', {icon: 2, time: 2000});
                            }
                        },
                        error: function (data) {
                            console.log(data);
                            ajax_error(data);
                        }///error---end
                    });
                }
            });
        });
        $('#sub_table').on('click', function () {
            ajax('put', '/{{config('constant.name_admin')}}/tool/relStdPut', tableData)
        })

        function chageSort(id,oldSort,ele) {
            let newSort = $(ele).val();
            tableData.sort[id] = newSort == oldSort ? '' : newSort;
        }

        /*删除*/
        function del(obj, id) {
            var index2;

            layer.confirm('确认要删除吗？', function (index) {
                $.ajax({
                    type: 'GET',
                    url: '/{{config('constant.name_admin')}}/tool/delRelStd' + '?id=' + id,
                    // dataType: 'json',
                    success: function (data) {
                        // console.log(data);
                        if (data === '1') {
                            $(obj).parents("tr").remove();
                            layer.msg('删除成功!', {icon: 1, time: 2000});
                        } else {
                            layer.msg('删除失败!', {icon: 2, time: 2000});
                        }
                    },
                    error: function (data) {
                        ajax_error(data);
                    },
                    beforeSend: function () {
                        //0.4透明度 白色遮罩
                        index2 = layer.load(2, {shade: [0.05, '#000']});
                    },
                    complete: function () {
                        layer.close(index2);
                    },
                });
            });
        }

        /* 关联xxx */
        function rel_xxx(title, url, id, w, h) {
            layer_show(title, url + '?id=' + id, w, h);
        }

        /* 修改 */
        function edit(id) {
            var w = '';
            var h = '';

            layer_show('修改', '/{{config('constant.name_admin')}}/stdToolRel/edit?id=' + id, w, h);
        }
    </script>
    <!--/请在上方写此页面业务相关的脚本-->
@endsection
